<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="frmwkFrmWww/font-awesome-4.7.0/css/font-awesome.css">
<title>无标题文档</title>
<meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;" />
<link rel="stylesheet" type="text/css" href="frmwkFrmWww/AmazeUI-2.7.2/assets/css/amazeui.css">
<style type="text/css">
.line {
	border-bottom-color:	rgba(185,178,178,1.00);
 
	border-bottom-style:dashed;
	border-bottom-width:1px;
	
}
</style>
<script src="frmwkFrmWww/AmazeUI-2.7.2/assets/js/jquery.min.js"></script>
<script src="frmwkFrmWww/AmazeUI-2.7.2/assets/js/amazeui.js"></script>

<script src="com.atilax.frmwk/vue.js"></script>
</head>

<body>


<section class="am-panel am-panel-default">
  <header class="am-panel-hd">
   <a href="main.html"> <i class="fa fa-arrow-circle-left" aria-hidden="true"></i>返回</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <h3 class="am-panel-title" style="display:inline-block">档案预览</h3>
  </header>
  <div class="am-panel-bd">
     <script>
	 window.onError=function()
	 {
	alert( JSON.stringify(arguments)    );
	 
	 }
	 function sizeM(s)
	 {
	 return   (s/1000).toFixed(2);
	 }
	 
	 </script>
    <table width="100%" border="0"  id="table1">
      <tbody>
        <tr   v-for="(dataItem,index) in list_data1" >
          <td>   <a href="#">   <i class="fa fa-film"></i>&nbsp;&nbsp;  {{dataItem.filename}}
          
          <br>
          <div style="" class="line">{{sizeM(dataItem.size)}}KB</div>
          </a></td>
          <td>&nbsp;</td>
          <td> <input type="checkbox"></td>
        </tr>
       
        <tr>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
        </tr>
      </tbody>
    </table>
<video width="320" height="240" controls="controls" id="vd_ctrl">
  <source src="test.mp4" type="video/mp4" />
   
</video>
 
  </div>
</section>

<div  style="position:fixed;bottom:5px;text-align:center;width:100%">

  <p style="text-align:center">
    <input type="button" name="button" id="button" value="全选" class="am-btn am-btn-secondary">
    <input type="button" name="button" id="button" value="播放" class="am-btn am-btn-secondary"   onClick="play()">
    <script>
	function play()
	{
		$("#vd_ctrl").show();
	   	$("#vd_ctrl").get(0).play();
		
	}
	$("#vd_ctrl").hide();
	
	
	var   VueObj1 =  new Vue({
          el: '#table1',
      	  data: {
            list_data1: []
          }
   });
   
   function page_load(){
   
   api_url="http://localhost:8088";
   	var url=api_url+"/dirlist"; //  ?m=qm&p1="+encodeURIComponent(encodeURIComponent(s));
	

   	fetch(url).then(response =>		response.json())
  .then(data => {
	console.log("---line1:");
	console.log("---data:"+data);
	console.log("---line2:");
	 $("#dbgipt").val(  "---data:"+data  );
	//VueObj1.$data.list_data1=data;
	//	data=data[1];
		alldata_r44=data;
		//alert( JSON.stringify(data) );
		console.log("---ajax data 2 alldata r44:"+alldata_r44);
		VueObj1.$data.list_data1=data;
	}
  )
  .catch(e => console.log("Oops, error", e));
		/*	*/
 }
 //alert();
 try{
 page_load();
 }catch(e)
 
 {
// alert(e);
// $("#dbgipt").val($("#dbgipt").val()+  JSON.stringify(e)  );
    //  alert(e);
 }
	
	
	
	</script>
    
    <input type="button" name="button" id="button" value="删除" class="am-btn am-btn-secondary">
	    <input type="button" name="button" id="button" value="另存为" class="am-btn am-btn-secondary">
  </p>
  
  <textarea id="dbgipt"   cols=40 rows=10 style="display:none"></textarea>

</div>

 </body>
</html>
